import { connect } from "umi";
import {
  QueryFilter,
  ProFormText,
  ProFormSelect,
  ProFormDateTimeRangePicker,
} from "@ant-design/pro-components";

const FilterForm = (props: any) => {
  const { loading, dispatch } = props;
  const searchForm = (params: any) => {
    if (params?.operTime) {
      const { operTime } = params;
      const [startTime, endTime] = operTime;
      // Object.assign(params, {
      //   beginTime:startTime,
      //   endTime,
      // });
      params.params = {
        beginTime: startTime,
        endTime,
      };
      delete params.operTime;
    }
    // console.log(params)
    dispatch({
      type: "SystemOperateLog/queryTableData",
      params,
    });
  };
  return (
    <QueryFilter<{
      name: string;
      company: string;
    }>
      defaultCollapsed={false}
      onFinish={searchForm}
      onReset={() => searchForm(undefined)}
      loading={loading}
      style={{ backgroundColor: "#fff", marginBottom: 16 }}
    >
      <ProFormText
        name="title"
        label="系统模块"
        rules={[{ max: 20 }]}
        placeholder="请输入系统模块"
      />
      <ProFormText
        name="operName"
        label="操作人员"
        rules={[{ max: 20 }]}
        placeholder="请输入操作人员"
      />
      <ProFormDateTimeRangePicker
        name="operTime"
        label="操作时间"
        placeholder={["开始时间", "结束时间"]}
      />
      <ProFormSelect
        name="businessType"
        label="操作项目"
        showSearch
        placeholder="请选择操作项目"
        options={[
          {
            label: "其他",
            value: "0",
          },
          {
            label: "新增",
            value: "1",
          },
          {
            label: "修改",
            value: "2",
          },
          {
            label: "删除",
            value: "3",
          },
          {
            label: "导出",
            value: "5",
          },
          {
            label: "强退",
            value: "7",
          },
        ]}
      />
      <ProFormText
        name="phonenumber"
        label="手机号码"
        rules={[{ max: 11 }]}
        placeholder="请输入手机号码"
      />
      {/* <ProFormText
        name="identityCard"
        label="身份证号"
        rules={[{ max: 18 }]}
        placeholder="请输入身份证号"
      /> */}
      <ProFormSelect
        name="status"
        label="操作结果"
        placeholder="请选择操作结果"
        options={[
          { label: "正常", value: "0" },
          { label: "异常", value: "1" },
        ]}
        style={{ backgroundColor: "#fff" }}
      />
    </QueryFilter>
  );
};

export default connect(({ loading, SystemOperateLog }) => {
  return {
    ...SystemOperateLog,
    loading: loading.effects["SystemOperateLog/queryTableData"] || false,
  };
})(FilterForm);
